<template>

    <div v-if="uid === ''">
      <input v-model="name">
      <button @click="cha">查询</button>
      <tr>
        <td>名称</td>
        <td>价格</td>
        <td>图片</td>
        <td>操作</td>
      </tr>
      <tr v-for="i in goodslist">
        <td>{{i.text}}</td>
        <td>{{i.price}}</td>
        <td><img :src="'http://127.0.0.1:8000/'+i.img" alt=""></td>
        <td><button @click="lo">立即预定</button></td>
      </tr>
    </div>
    <div v-else>
      <input v-model="name">
      <button @click="cha">查询</button>
      <tr>
        <td>名称</td>
        <td>价格</td>
        <td>图片</td>
        <td>操作</td>
      </tr>
      <tr v-for="i in goodslist">
        <td>{{i.text}}</td>
        <td>{{i.price*0.8}}</td>
        <td><img :src="'http://127.0.0.1:8000/'+i.img" alt=""></td>
        <td><button @click="lo(i)">立即预定</button></td>
      </tr>
    </div>
</template>

<script>
    export default {
        name: "chanpin",
      data:function () {
        return{
          goodslist:[],
          uid:'',
          name:'',
        }
      },
      mounted:function(){
        let userid = localStorage.getItem('uid');
          if(userid==null){
            this.uid=''
          }else {
            this.uid = userid
          }

        this.axios({
          url:'http://127.0.0.1:8000/goods/',
          method:'get'
        }).then(res=>{
          if(res.data.code==200){
            this.goodslist = res.data.message;

          }
        })
      },
      methods:{
          lo:function (i) {
            let uid = localStorage.getItem('uid');
            if(uid===null){
              this.$router.push('log')
            }else {
              //服务器保存图片地址
              localStorage.setItem('chanpin', i['img']);
              localStorage.setItem('price', (i['price']*0.8));
              this.$router.push('ding');
            }

          },

        cha:function () {
            alert(this.name)
          this.axios({
            url:'http://127.0.0.1:8000/good/',
            method:'get',
            params:{name:this.name}
          }).then(res=>{
              this.goodslist = res.data
          })
        }


      }
    }
</script>

<style scoped>

</style>
